import { createApp } from 'vue'
import axios from 'axios'
import App from './App.vue'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'

import Draggable from '@/../lib/vuedraggable/dist/vuedraggable.umd.js'
import { registerIcon } from '@/utils/el-icons'
import 'virtual:svg-icons-register'

import ContainerWidgets from '@/components/form-designer/form-widget/container-widget/index'
import ContainerItems from '@/components/form-render/container-item/index'

import { addDirective } from '@/utils/directive'
import { installI18n } from '@/utils/i18n'
import { loadExtension } from '@/extension/extension-loader'

import VxeTablePlugins from '@/plugins/vxe-table-plugins.jsx'
import 'vxe-table/lib/style.css';

// 引入全局组件配置
import { setupComponents } from '@/components/index.js';

import other from '@/utils/other.js';

import '@/styles/index.scss'

if (typeof window !== 'undefined') {
  window.axios = axios
}

const vfApp = createApp(App)

// 注册全局组件
setupComponents(vfApp);

other.elSvg(vfApp);
vfApp.use(ElementPlus)

// 注册全局图标（一般在按钮中使用）
registerIcon(vfApp)
// 注册拖拽组件
vfApp.component('draggable', Draggable)
// 注册自定义指令
addDirective(vfApp)
// 安装国际化信息
installI18n(vfApp)

vfApp.use(ContainerWidgets)
vfApp.use(ContainerItems)
loadExtension(vfApp)

vfApp.use(VxeTablePlugins)
vfApp.mount('#app')
